/***********
*@杨永
*@使用说明
*var calendary = new  WallCalendary({
														width:175,     //挂历的宽度, 必填
														height:652,	//挂历的高度，必填
														offsetTop:200,   //页面滚动条多少启动挂历，必填
														pageMainWidth:980,  //主页面宽度，用来定位挂历位置，可选
														position:"right",    //挂历显示在主页面的右边，可选，默认右边对齐
														header:{
																	title:"大麦节活动",
																	src:"images/side_01.png"
																	//href:"fwefwe.jp"
																	//target:"/"
																	},
														footer:{
																	title:"大麦节挂历底部",
																	src:"images/side_16.png",
																	//href:"#gotop",
																	//target:"_self",
																	callback:function(){
																		$("html,body").animate({scrollTop:0});
																		}
																	},
														content:[
																		{
																			title:"社区活动O2O介绍",
																			src:"images/side_02.png",
																			hoverSrc:"images/side_hover_02.png",
																			href:"http://www.baidu.com",
																		   target:"_self",
																			currentDate:2015-10-15 11:00:00, //正确的日期格式，最好是服务器时间
																			startDate:"2015-10-15 11:00:00", //活动的开始时间
																		    endDate:"2015-10-15 17:30:00"//活动的结束时间
																		}
														]
													});
********/
define(function(require){
	
	var $ = require("jq");
	var css = require("/pinzhiV2.0/css/wall-calendary.css");
	//依赖倒计时组件
	var Timer = require("count-down.js");
	var WallCalendary = function(settings){
		
		var _this_ = this;
		this.settings = {
						//挂历的宽度
						width:185,
						height:500,   
						//挂历在滚动条滚动多少开启显示
						offsetTop:500,   
						//主页面的宽度，用来计算挂历显示的左右边位置
						pageMainWidth:980, 
						//挂历显示在左边还是右边
						position:"right",
						//挂历的头部信息
						header:false,
						//挂历的底部
						footer:false,
						//挂历的列表
						content:false,
						//服务器时间
						currentDate:false
						};
		
		//扩展配置参数
		$.extend(this.settings,settings);
		
		/**
		*构建挂历的主要DOM结构
		*根据配置参数创建内部挂历结构
		*初始化完成后插入BODY
		*/
		this.bodyNode = $(document.body);
		this.calendaryContainer = $("<div class='g-wall-calendary'>");
		this.calendaryHeader = $("<div class='wall-calendary-header'>");
		this.calendaryContent= $("<div class='wall-calendary-content'>");
		this.calendaryFooter= $("<div class='wall-calendary-footer'>");
		//渲染DOM
		this._renderDom();

		this.scrollTimer = null;
		//绑定滚事件
		$(window).scroll(function(){
			window.clearTimeout(_this_.scrollTimer);
			_this_.scrollTimer = window.setTimeout(function(){
				_this_.scrollInit();
			},100);
		}).resize(function(){
			_this_.setVertical();
		});
		//刷新就吃石化
		this.scrollInit();
	};
	
	WallCalendary.prototype = {
		scrollInit:function(){
			var offsetTop = this.settings.offsetTop,
				   scrollTop = $(window).scrollTop();
			//判断时候显示
			if(scrollTop>=offsetTop){
				this.calendaryContainer.fadeIn();
			}else{
				this.calendaryContainer.fadeOut();
			};
		},
		//创建内容区域列表
		_createList:function(arr){
			
			var self = this,
				  content = self.calendaryContent,
				  currentDate = self.settings.currentDate;

			var ul = $("<div class='wall-calendary-list'>");
			//循环数据创建列表
			var skinPath = self.settings.imgPath;
			$(arr).each(function(i,o){
				
					var li = $("<div class=custom-"+(++i)+"/>");
					var a = $(document.createElement("a"));
					
					var title = o.title?"title='"+o.title+"'":"";
					var src = skinPath+o.src;
					var hoverSrc = skinPath+o.hoverSrc;
					var target = o.target?o.target:"_blank";
					var href= o.href?o.href:"javascript:void(0);";
					var startDate = o.startDate?o.startDate:false;
					
					a.attr("target",target);
					//如果没有指定启动时间就直接设置上链接
					if(startDate == false){
						a.attr("href",href);
					}else{
						
						//如果制定了开启时间
						a.attr("href","javascript:void(0);");
						a.attr("target","_self");
						//确认服务器时间，开hi时间，结束时间
						var endDate = o.endDate?o.endDate:false;
						a.attr("data-nowtime",currentDate);
						a.attr("data-starttime",startDate);
						if(endDate){
							a.attr("data-endtime",endDate);
						};
						
						//创建倒计时功能
						new Timer({
									timerBox:a,
									callBack:function(){
										$(this).attr("href",href);
										$(this).attr("target",target);
										//如果指定了结束时间
										if(endDate){
											
											//如果当前时间已经大于开始时间
											//那么data-nowtime就是当前时间，否就就是开始时间
											var cV = Number(currentDate.replace(/\s+|:|-/gi,""));
											var sV = Number(startDate.replace(/\s+|:|-/gi,""));
											if(cV>=sV){
												a.attr("data-nowtime",currentDate);
											}else{
												a.attr("data-nowtime",startDate);
											};
											a.attr("data-starttime",endDate);
											//创建倒计时功能
											new Timer({
														timerBox:a,
														callBack:function(){
															$(this).attr("href","javascript:void(0);");
															$(this).attr("target","_self");
														}
											});
											
										};
									}
						});
					};
					//a.html("<span class='after'><img src='"+src+"'></span><span class='before'><img src='"+hoverSrc+"'></span>");
					a.html("<img class='after' src='"+src+"'><img class='before' src='"+hoverSrc+"'>");
					li.append(a);
					ul.append(li);
			});
			content.append(ul);
		},
		setVertical:function(){
			var winHeight = $(window).height();
			//如果top小于0，就让定位在顶部
			var top = (winHeight-this.settings.height)/2<=0?0:(winHeight-this.settings.height)/2;
			this.calendaryContainer.css("top",top);
		},
		//根据配置参数渲染dom到body
		_renderDom:function(){
			var self = this,
				   setting = self.settings;
			//设置挂历相应的尺寸位置等参数
			this.calendaryContainer.width(setting.width);
			this.calendaryContainer.height(setting.height);
			//设置挂历垂直方向居中
			this.setVertical();
			//如果指定了页面注宽度，就定位，否则就靠页面最左边
			if(setting.position == "right"){
				this.calendaryContainer.css({marginLeft:setting.pageMainWidth/2});
			}else if(setting.position == "left"){
				this.calendaryContainer.css({marginLeft:-(setting.pageMainWidth/2)-setting.width});
			}else{
				this.calendaryContainer.css({left:"auto",right:0});
			};
			//创建头
			//保存皮肤路径
			var skinPath = setting.imgPath;
			if(setting.header){
				var href = setting.header.href?setting.header.href:"javascript:void(0);";
				var src = skinPath+setting.header.src;
				var target = setting.header.target?setting.header.target:"_self";
				this.calendaryHeader.html("<a href='"+href+"' target='"+target+"'><img src='"+src+"'>"); 
				this.calendaryContainer.append(this.calendaryHeader);
			};
			
			/*****
			*创建列表，列表JSON格式配置
			*默认显示的图片
			*鼠标hover上的图片切换
			*立刻启动的跳转链接
			*延时启动的时间
			***/
			
			if(setting.content){
				var dataList = setting.content;
				self._createList(dataList);
				this.calendaryContainer.append(this.calendaryContent);
			};

			//创建尾

			if(setting.footer){
				var href = setting.footer.href?setting.footer.href:"javascript:void(0);";
				var src = skinPath+setting.footer.src;
				var target = setting.footer.target?setting.footer.target:"_self";
				
				this.calendaryFooter.html("<a href='"+href+"' target='"+target+"'><img src='"+src+"'>"); 
				//如果配置了回调函数
				if(setting.footer.callback){
					this.calendaryFooter.click(function(){
						setting.footer.callback();
					});
				};
				
				this.calendaryContainer.append(this.calendaryFooter);
			};	
			this.bodyNode.append(this.calendaryContainer);
		}
	};

	return  WallCalendary;
});